<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
    <title>用户注册</title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <meta name="description" content="用户管理">
    <meta name="author" content="羊糕">
    <link rel="stylesheet" type="text/css" th:href="@{/css/bootstrap.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/materialdesignicons.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/style.min.css}"/>
    <style>
        .lyear-wrapper {
            position: relative;
        }

        .lyear-register {
            display: flex !important;
            min-height: 100vh;
            align-items: center !important;
            justify-content: center !important;
        }

        .lyear-register:after {
            content: '';
            min-height: inherit;
            font-size: 0;
        }

        .register-center {
            background-color: rgba(255, 255, 255, .075);
            min-width: 29.25rem;
            padding: 2.14286em 3.57143em;
            border-radius: 3px;
            margin: 2.85714em;
        }

        .register-header {
            margin-bottom: 1.5rem !important;
        }

        .register-center .has-feedback.feedback-left .form-control {
            padding-left: 38px;
            padding-right: 12px;
            background-color: rgba(255, 255, 255, .075);
            border-color: rgba(255, 255, 255, .075)
        }

        .register-center .has-feedback.feedback-left .form-control-feedback {
            left: 0;
            right: auto;
            width: 38px;
            height: 38px;
            line-height: 38px;
            z-index: 4;
            color: #dcdcdc;
        }

        .register-center .has-feedback.feedback-left.row .form-control-feedback {
            left: 15px;
        }

        .register-center .form-control::-webkit-input-placeholder {
            color: rgba(255, 255, 255, .8);
        }

        .register-center .form-control:-moz-placeholder {
            color: rgba(255, 255, 255, .8);
        }

        .register-center .form-control::-moz-placeholder {
            color: rgba(255, 255, 255, .8);
        }

        .register-center .form-control:-ms-input-placeholder {
            color: rgba(255, 255, 255, .8);
        }

        .register-center .custom-control-label::before {
            background: rgba(0, 0, 0, 0.3);
            border-color: rgba(0, 0, 0, 0.1);
        }

        .register-center .lyear-checkbox span::before {
            border-color: rgba(255, 255, 255, .075)
        }
    </style>
</head>

<body>
<div class="card">
    <div class="card-header"><h4>用户注册</h4></div>
    <div class="card-body">

        <form class="form-horizontal" th:action="@{registerUser}" method="post">
            <div class="form-group">
                <div class="col-md-4 control-label">用户名</div>
                <div class="col-md-4">
                    <input type="text" placeholder="请输入您的用户名" class="form-control" name="username"
                           id="username"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4 control-label">密码</div>
                <div class="col-md-4">
                    <input type="password" placeholder="请输入密码" class="form-control" id="password"
                                             name="password"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4 control-label">确认密码</div>
                <div class="col-md-4">
                    <input type="password" placeholder="请输入密码" class="form-control" id="ensure_password"
                           name="ensure_password"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4 control-label">邮箱</div>
                <div class="col-md-4">
                    <input type="text" placeholder="请输入邮箱" class="form-control" id="email" name="email"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4 control-label">余额</div>
                <div class="col-md-4">
                    <input type="text" placeholder="请输入余额" class="form-control" id="amount" name="amount"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4 control-label">生日</div>
                <div class="col-md-4">
                    <input type="date" class="form-control" id="birth" name="birth"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-4"></div>
                <div class="col-md-4">
                <button class="btn btn-cyan btn-w-md " type="submit">立即注册</button>
                </div>
            </div>
        </form>

    </div>
</div>

<script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
<script type="text/javascript" th:src="@{/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/js/perfect-scrollbar.min.js}"></script>
<script type="text/javascript" th:src="@{/js/main.min.js}"></script>
<script type="text/javascript"></script>
</body>
</html>